﻿<%@ Page Title="Report Filters - Multimedia" Language="C#" MasterPageFile="~/user.master"
    AutoEventWireup="true" Inherits="MediaMonitor.Users.Report_All_Filter" CodeBehind="report-all-filter.aspx.cs" %>

<%--@ OutputCache Duration="3600" VaryByParam="none"--%>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<%@ Register Src="~/Controls/AutoCompleteExtender.ascx" TagPrefix="ctrl" TagName="AutoComplete" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
<asp:Content ID="Content1" ContentPlaceHolderID="Head" runat="Server">
    
    <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
        <script type="text/javascript">

            function DateSelected(sender, eventArgs) {


                var date1 = eventArgs.get_renderDay().get_date();
                var dfi = sender.DateTimeFormatInfo;
                var formattedDate = dfi.FormatDate(date1, dfi.ShortDatePattern);

                var calE = $find("<%= calE.ClientID %>");
                var str = date1.toString();
                var ret = str.split(",");


                calE.selectDate(date1, true)
                $('#lblSelectedFromDate').text(ret[0] + '/' + ret[1] + '/' + ret[2]);
                var str2 = calE.get_selectedDates().toString();
                var ret2 = str2.split(",");

                $('#lblSelectedToDate').text(ret2[0] + '/' + ret2[1] + '/' + ret2[2]);

                //calE.get_selectedDates()
            }
            function DateSelected1(sender, eventArgs) {


                var date11 = eventArgs.get_renderDay().get_date();

                var str3 = date11.toString();
                var ret3 = str3.split(",");


                $('#lblSelectedToDate').text(ret3[0] + '/' + ret3[1] + '/' + ret3[2]);
                //calE.get_selectedDates()
            }
        </script>
    </telerik:RadCodeBlock>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="Body" runat="Server">
    <asp:Panel ID="pnlSearch" runat="server" CssClass="report-filter-product">
         
        <div class="clear">
        </div>
        <h2 class="title">
            <span>Dates</span></h2>
        <div class="five columns  alpha">
            <asp:Label ID="lblSelectedFromDate" runat="server" ClientIDMode="Static" Text=""
                Font-Size="16px" ForeColor="Red"></asp:Label>
            <br />
            <telerik:RadCalendar AutoPostBack="false" ID="calS" runat="server" EnableMultiSelect="false"
                ClientEvents-OnDateSelected="DateSelected">
            </telerik:RadCalendar>
        </div>
        <div class="five columns  alpha">
            <asp:Label ID="lblSelectedToDate" runat="server" ClientIDMode="Static" Text="" Font-Size="16px"
                ForeColor="Red"></asp:Label>
            <br />
            <telerik:RadCalendar AutoPostBack="false" ID="calE" runat="server" EnableMultiSelect="false"
                ClientEvents-OnDateSelected="DateSelected1">
            </telerik:RadCalendar>
        </div>
        <div class="five columns  alpha">
            <br />
            Days
            <asp:CheckBoxList ID="chklstDays" runat="server">
                <asp:ListItem Value="6" Text="Sunday"></asp:ListItem>
                <asp:ListItem Value="0" Text="Monday"></asp:ListItem>
                <asp:ListItem Value="1" Text="Tuesday"></asp:ListItem>
                <asp:ListItem Value="2" Text="Wednesday"></asp:ListItem>
                <asp:ListItem Value="3" Text="Thursday"></asp:ListItem>
                <asp:ListItem Value="4" Text="Friday"></asp:ListItem>
                <asp:ListItem Value="5" Text="Saturday"></asp:ListItem>
            </asp:CheckBoxList>
        </div>
        <asp:UpdatePanel ID="pnlUpdate_ReportAllFilters" runat="server" UpdateMode="Always">
            <ContentTemplate>
        <br class="h10 clear">
        <h2 class="title">
        </h2>
        <div class="columns  alpha">
            <asp:Button ID="btnLoadLayout" runat="server" CssClass="button" OnClick="btnLoadLayout_Click"
                ClientIDMode="Static" Text="Load Layout" Enabled="false" />
        </div>
        <br class="h10 clear">
        <h2 class="title">
            <span>Media</span></h2>
      
                <div class="media-data">
                    <table class="media-data-table" width="100%">
                        <tbody>
                            <tr>
                                <td>
                                    Media Type
                                </td>
                                <td width="300px">
                                    <asp:DropDownList ID="lstMediaType" CssClass="aqua_input" runat="server" AutoPostBack="true"
                                        OnSelectedIndexChanged="lstMediaType_SelectedIndexChanged">
                                        <asp:ListItem Text="Multimedia" Value="0" Selected="True"></asp:ListItem>
                                        <asp:ListItem Text="Competition" Value="1"></asp:ListItem>
                                    </asp:DropDownList>
                                </td>
                                <td>
                                    &nbsp;
                                </td>
                            </tr>
                            <tr valign="top" id="trMedia_TV" runat="server" visible="false">
                                <td>
                                    TV Channels
                                </td>
                                <td width="300px" class="media-channels" align="left" style="font-size: small;">
                                    <script type="text/javascript">
                                        function chkAll_TV_Clicked(obj) {
                                            var selected = document.getElementById('<%=chkAll_TV.ClientID%>').checked;

                                            if (selected)
                                                document.getElementById('dvList_TV').style.display = 'none';
                                            else
                                                document.getElementById('dvList_TV').style.display = 'block';
                                        }
                                    </script>
                                    <asp:CheckBox ID="chkAll_TV" runat="server" Text="Search from all TV Channels" Checked="false" />
                                    <div id="dvList_TV" style="display: none;" class="Box">
                                        <asp:CheckBoxList ID="lstMedia_TV" runat="server" DataValueField="MediaCode" DataTextField="MediaName"
                                            RepeatColumns="5" RepeatDirection="Horizontal" Font-Size="8px">
                                        </asp:CheckBoxList>
                                    </div>
                                    <script type="text/javascript">
                                        document.getElementById('<%=chkAll_TV.ClientID%>').onclick = chkAll_TV_Clicked;
                                    </script>
                                </td>
                                <td>
                                    <span class="date">Last available date:
                                        <asp:Label runat="server" ID="lblTVMax"></asp:Label></span>
                                </td>
                            </tr>
                            <tr valign="top" id="trMedia_Radio" runat="server" visible="false">
                                <td>
                                    Radio Channels
                                </td>
                                <td width="300px" class="media-channels" align="left" style="font-size: small;">
                                    <script type="text/javascript">
                                        function chkAll_Radio_Clicked(obj) {
                                            var selected = document.getElementById('<%=chkAll_Radio.ClientID%>').checked;

                                            if (selected)
                                                document.getElementById('dvList_Radio').style.display = 'none';
                                            else
                                                document.getElementById('dvList_Radio').style.display = 'block';
                                        }
                                    </script>
                                    <asp:CheckBox ID="chkAll_Radio" runat="server" Text="Search from all Radio Channels"
                                        Checked="false" />
                                    <div id="dvList_Radio" style="display: none;" class="Box">
                                        <asp:CheckBoxList ID="lstMedia_Radio" runat="server" DataValueField="MediaCode" DataTextField="MediaName"
                                            RepeatColumns="5" RepeatDirection="Horizontal" Font-Size="8px">
                                        </asp:CheckBoxList>
                                    </div>
                                    <script type="text/javascript">
                                        document.getElementById('<%=chkAll_Radio.ClientID%>').onclick = chkAll_Radio_Clicked;
                                    </script>
                                </td>
                                <td>
                                    <span class="date">Last available date:
                                        <asp:Label runat="server" ID="lblRadioMax"></asp:Label></span>
                                </td>
                            </tr>
                            <tr valign="top" id="trMedia_Cable" runat="server" visible="false">
                                <td>
                                    Cable Channels
                                </td>
                                <td width="300px" class="media-channels" align="left" style="font-size: small;">
                                    <script type="text/javascript">
                                        function chkAll_Cable_Clicked(obj) {
                                            var selected = document.getElementById('<%=chkAll_Cable.ClientID%>').checked;

                                            if (selected)
                                                document.getElementById('dvList_Cable').style.display = 'none';
                                            else
                                                document.getElementById('dvList_Cable').style.display = 'block';
                                        }
                                    </script>
                                    <asp:CheckBox ID="chkAll_Cable" runat="server" Text="Search from all Cable Channels"
                                        Checked="false" />
                                    <div id="dvList_Cable" style="display: none;" class="Box">
                                        <asp:CheckBoxList ID="lstMedia_Cable" runat="server" DataValueField="MediaCode" DataTextField="MediaName"
                                            RepeatColumns="5" RepeatDirection="Horizontal" Font-Size="8px">
                                        </asp:CheckBoxList>
                                    </div>
                                    <script type="text/javascript">
                                        document.getElementById('<%=chkAll_Cable.ClientID%>').onclick = chkAll_Cable_Clicked;
                                    </script>
                                </td>
                                <td>
                                    <span class="date">Last available date:
                                        <asp:Label runat="server" ID="lblCableMax"></asp:Label></span>
                                </td>
                            </tr>
                            <tr valign="top" id="trMedia_Press" runat="server" visible="false">
                                <td>
                                    Press Media
                                </td>
                                <td width="300px" class="media-channels" align="left" style="font-size: small;">
                                    <script type="text/javascript">
                                        function chkAll_Press_Clicked(obj) {
                                            var selected = document.getElementById('<%=chkAll_Press.ClientID%>').checked;
                                            // 
                                            if (selected)
                                                document.getElementById('dvList_Press').style.display = 'none';
                                            else
                                                document.getElementById('dvList_Press').style.display = 'block';
                                        }
                                    </script>
                                    <asp:CheckBox ID="chkAll_Press" runat="server" Text="Search from all Press Media"
                                        Checked="false" />
                                    <div id="dvList_Press" style="display: none;" class="Box">
                                        <asp:CheckBoxList ID="lstMedia_Press" runat="server" DataValueField="MediaCode" DataTextField="MediaName"
                                            RepeatColumns="5" RepeatDirection="Horizontal" Font-Size="8px">
                                        </asp:CheckBoxList>
                                    </div>
                                    <script type="text/javascript">
                                        document.getElementById('<%=chkAll_Press.ClientID%>').onclick = chkAll_Press_Clicked;
                                    </script>
                                </td>
                                <td>
                                    <span class="date">Last available date:
                                        <asp:Label runat="server" ID="lblPressMax"></asp:Label></span>
                                </td>
                            </tr>
                            <tr valign="top" id="trMedia_OutDoor" runat="server" visible="false">
                                <td>
                                    OutDoor Media
                                </td>
                                <td width="300px" class="media-channels" align="left" style="font-size: small;">
                                    <script type="text/javascript">
                                        function chkAll_OutDoor_Clicked(obj) {
                                            var selected = document.getElementById('<%=chkAll_OutDoor.ClientID%>').checked;
                                            //
                                            if (selected)
                                                document.getElementById('dvList_OutDoor').style.display = 'none';
                                            else
                                                document.getElementById('dvList_OutDoor').style.display = 'block';
                                        }
                                    </script>
                                    <asp:CheckBox ID="chkAll_OutDoor" runat="server" Text="Search from all OutDoor Media"
                                        Checked="false" />
                                    <span style="color: Green; padding-left: 19px;">Last available date: </span>
                                    <div id="dvList_OutDoor" style="display: none;" class="Box">
                                        <asp:CheckBoxList ID="lstMedia_OutDoor" runat="server" DataValueField="MediaCode"
                                            DataTextField="MediaName" RepeatColumns="5" RepeatDirection="Horizontal" Font-Size="8px">
                                        </asp:CheckBoxList>
                                    </div>
                                    <script type="text/javascript">
                                        document.getElementById('<%=chkAll_OutDoor.ClientID%>').onclick = chkAll_OutDoor_Clicked;
                                    </script>
                                </td>
                                <td>
                                    <span class="date">Last available date:
                                        <asp:Label runat="server" ID="lblOutdoorMax"></asp:Label></span>
                                </td>
                            </tr>
                            <tr valign="top" id="tr1" runat="server" visible="false">
                                <td>
                                    Internet Media
                                </td>
                                <td width="300px" class="media-channels" align="left" style="font-size: small;">
                                    <script type="text/javascript">
                                        function chkAll_Internet_Clicked(obj) {
                                            var selected = document.getElementById('<%=chkAll_Internet.ClientID%>').checked;
                                            // 
                                            if (selected)
                                                document.getElementById('dvList_Internet').style.display = 'none';
                                            else
                                                document.getElementById('dvList_Internet').style.display = 'block';
                                        }
                                    </script>
                                    <asp:CheckBox ID="chkAll_Internet" runat="server" Text="Search from all Internet Media"
                                        Checked="false" />
                                    <div id="dvList_Internet" style="display: none;" class="Box">
                                        <asp:CheckBoxList ID="lstMedia_Internet" runat="server" DataValueField="MediaCode"
                                            DataTextField="MediaName" RepeatColumns="5" RepeatDirection="Horizontal" Font-Size="8px">
                                        </asp:CheckBoxList>
                                    </div>
                                    <script type="text/javascript">
                                        document.getElementById('<%=chkAll_Internet.ClientID%>').onclick = chkAll_Internet_Clicked;
                                    </script>
                                </td>
                                <td>
                                    <span class="date">Last available date:
                                        <asp:Label runat="server" ID="lblInternetMax"></asp:Label></span>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </div>
                <br class="h10 clear">
                <h2 class="title">
                    <span>Products</span></h2>
                <div class="columns  alpha">
                    <p>
                        <label for="">
                            Sector</label>
                        <asp:DropDownList ID="lstSector" CssClass="aqua_input" runat="server" AutoPostBack="true"
                            OnSelectedIndexChanged="lstSector_Changed" DataTextField="SectorName" DataValueField="SectorName" />
                    </p>
                    <p>
                        <label for="">
                            Sub Sector</label>
                        <asp:DropDownList ID="lstSubSector" CssClass="aqua_input" runat="server" AutoPostBack="true"
                            OnSelectedIndexChanged="lstSubSector_Changed" DataTextField="SubSectorName" DataValueField="SubSectorName" />
                    </p>
                    <p style='display: <%=AppUser.GetCountry()==177 ? "table-row": "none" %>'>
                        <label for="">
                            Sub Sector</label>
                        <asp:DropDownList ID="lstSubSector2" CssClass="aqua_input" runat="server" AutoPostBack="true"
                            OnSelectedIndexChanged="lstSubSector_Changed" DataTextField="SubSectorName" DataValueField="SubSectorName" />
                    </p>
                    <p>
                        <label for="">
                            Category</label>
                        <asp:LinkButton runat="server" ID="lnkCategory" Text="Click to Select Category" OnClick="lnkCategory_Click"></asp:LinkButton>
                        <asp:HiddenField ID="hdnCategoryIds" runat="server" /><br />
                        <div style="padding-left:92px;">Selected Category(s):-<asp:Label runat="server" ID="lblSelectedCategory" Text=""></asp:Label></div>
                         
                       <%-- <asp:DropDownList ID="lstCategory" CssClass="aqua_input" runat="server" DataTextField="CategoryName"
                            DataValueField="CategoryName" AutoPostBack="true" OnSelectedIndexChanged="lstCategory_SelectedIndexChanged" />--%>
                    </p>
                    <br class="h10 clear">
                    <p>
                    </p>
                    <asp:Panel runat="server" ID="PnlCompetitionBrands" Visible="false">
                        <p>
                            <label for="">
                                Group By
                            </label>
                            <script type="text/javascript">

                                function chkCompetition_Clicked(obj) {
                                    alert(obj);
                                    var selected = document.getElementById('<%=chkCompetition.ClientID%>').checked;

                                    if (selected)
                                        document.getElementById('divCompetition').style.display = 'none';
                                    else {
                                        alert('wrking');
                                        document.getElementById('divCompetition').style.display = 'block';
                                    }
                                }
               
               
                            </script>
                            <asp:CheckBox ID="chkCompetition" runat="server" Text="Search from all products(List)"
                                OnCheckedChanged="chkCompetition_CheckedChanged" AutoPostBack="true" Checked="true" />&nbsp;&nbsp;
                            <asp:CheckBox ID="chkAdvertiser" runat="server" Text="Search from all advertiser(List)"
                                OnCheckedChanged="chkAdvertiser_CheckedChanged" AutoPostBack="true" />
                            <div id="divCompetition" runat="server" visible="false" class="Box">
                                <asp:CheckBoxList ID="chkLstCompetition" runat="server" DataValueField="BrandName"
                                    DataTextField="BrandName" RepeatColumns="3" RepeatDirection="Horizontal" Font-Size="8px">
                                </asp:CheckBoxList>
                            </div>
                            <div id="divAdvertisersList" runat="server" visible="false" class="Box">
                                <asp:CheckBoxList ID="ChkAdvertiserList" runat="server" DataValueField="AdvertiserName"
                                    DataTextField="AdvertiserName" RepeatColumns="3" RepeatDirection="Horizontal"
                                    Font-Size="8px">
                                </asp:CheckBoxList>
                            </div>
                            <script type="text/javascript">
                                document.getElementById('<%=chkCompetition.ClientID%>').onclick = chkCompetition_Clicked;
                            </script>
                        </p>
                    </asp:Panel>
                    <asp:Panel runat="server" ID="pnlforMultimedia">
                        <p>
                            <label for="">
                                Advertiser
                            </label>
                            <asp:DropDownList CssClass="aqua_input" ID="lstAdvertiser" runat="server" DataTextField="AdvertiserName"
                                DataValueField="AdvertiserName" />
                        </p>
                        <p>
                            <label for="">
                                Agency</label>
                            <asp:DropDownList CssClass="aqua_input" ID="lstAgency" runat="server" DataTextField="AgencyName"
                                DataValueField="AgencyName" />
                        </p>
                        <p class="input-style">
                            <label for="">
                                Product</label>
                            <asp:LinkButton runat="server" ID="lnkProduct" Text="Click to Select Product" OnClick="lnkProduct_Click"></asp:LinkButton>
                            <asp:HiddenField ID="hdnProductIDs" runat="server" /><br />
                            <div style="padding-left:92px;">Selected Product(s):-<asp:Label Text="" runat="server" ID="lblSelectedProduct"></asp:Label></div>
                            <%--<ctrl:AutoComplete ID="acBrand" runat="server" MinimumPrefixLength="2" ServicePath="~/users/report-all-filter.aspx"
                                ServiceMethod="AutoComplete_FillBrand" completionsetcount="10" />--%>
                            <asp:HiddenField runat="server" ID="hdnUserWriteProductName" />
                        </p>
                        <p style="display: none;" class="input-style">
                            <label for="">
                                Product</label>
                            <ctrl:AutoComplete ID="acProduct" runat="server" MinimumPrefixLength="2" ServicePath="~/users/report-all-filter.aspx"
                                ServiceMethod="AutoComplete_FillProduct" completionsetcount="10" />
                        </p>
                        <p style="display: none;" class="input-style">
                            <label for="">
                                Version</label>
                            <ctrl:AutoComplete ID="acVersion" runat="server" MinimumPrefixLength="2" ServicePath="~/users/report-all-filter.aspx"
                                ServiceMethod="AutoComplete_FillVersion" completionsetcount="10" />
                        </p>
                    </asp:Panel>
                </div>
            
        <br class="h10 clear">
        <h2 class="title">
            <span style="display: none;">Options</span></h2>
        <div class="alpha">
            <p style="display: none;" class="price-from">
                <label for="">
                    Price From
                </label>
                <asp:TextBox ID="tbPriceFrom" runat="server" Width="80"></asp:TextBox>
                <asp:RangeValidator ID="rvPriceFrom" runat="server" ControlToValidate="tbPriceFrom"
                    Display="Dynamic" ErrorMessage="Invalid price" MaximumValue="9999" MinimumValue="0"
                    Text="Invalid price" Type="Currency" />
                <label for="">
                    Price To
                </label>
                <asp:TextBox ID="tbPriceTo" runat="server" Width="80"></asp:TextBox>
                <asp:RangeValidator ID="rvPriceTo" runat="server" ControlToValidate="tbPriceTo" Display="Dynamic"
                    ErrorMessage="Invalid price" MaximumValue="9999" MinimumValue="0" Text="Invalid price"
                    Type="Currency" />
            </p>
            <p class="input-style" style="display: none;">
                <label for="">
                    Start Time</label>
                 <telerik:radmaskedtextbox ID="txtStartTime1" runat="server" CssClass="aqua_input"  mask="<00..23>:<00..59>">
    </telerik:radmaskedtextbox>
                <label for="">
                    End Time
                </label>
                <telerik:radmaskedtextbox ID="txtEndTime1" runat="server" CssClass="aqua_input"  mask="<00..23>:<00..59>">
    </telerik:radmaskedtextbox>
            </p>
            <br class="clear" />
            <p style="margin: 0; font-size: 10px;">
                Download all the videos, audios, or images related to your:</p>
            <asp:CheckBox ID="chkFirstAppearance" runat="server" Checked="false" Text="Show only the first appearance of commerical"
                Visible="false" />
            <asp:CheckBox ID="chkDownload" runat="server" Checked="false" Text="category" Font-Bold="true" />
            &nbsp;
            <asp:CheckBox ID="chkDownloadProduct" runat="server" Checked="false" Text="product"
                Font-Bold="true" />
            &nbsp;
            <asp:CheckBox ID="chkDownloadAdvertiser" runat="server" Checked="false" Text="advertiser"
                Font-Bold="true" />
            <br class="clear" />
            <p>
            </p>
            <p class="form-submit">
                <asp:Button ID="btnSearch" CssClass="button" runat="server" Text="Search" OnClick="btnSearch_Click"
                    SkinID="Search" />
                <asp:HiddenField ID="hdnLayoutID" runat="server" />
                <asp:HiddenField ID="hdnLayoutName" runat="server" />
                <asp:Button ID="btnSaveLayout" CssClass="button Button-Save" runat="server" Text="Save Layout"
                    ClientIDMode="Static" OnClick="btnSaveLayout_Click" Enabled="false" />
                <%--   <asp:UpdatePanel ID="pnlUpdate_Submit" runat="server">
                    <ContentTemplate>--%>
                <asp:Label ID="lblErrorMsg" runat="server" Text="" ForeColor="red"></asp:Label>
                <%-- </ContentTemplate>
                    <Triggers>
                        <asp:AsyncPostBackTrigger ControlID="btnSearch" />
                    </Triggers>
                </asp:UpdatePanel>--%>
            </p>
        </div>
   
    <asp:HiddenField ID="hdnField" runat="server" />
    <asp:ModalPopupExtender ID="ModalPopupExtender1" runat="server" TargetControlID="hdnField"
        PopupControlID="pnlpopup" BackgroundCssClass="modalBackground" CancelControlID="LoadLayoutClose">
    </asp:ModalPopupExtender>
    <asp:Panel ID="pnlpopup" CssClass="pnlpopup" runat="server" BackColor="White" Height="269px"
        Width="400px" Style="display: none">
        <div class="closebtn">
            <a id="LoadLayoutClose" runat="server">X</a></div>
        <asp:CheckBoxList ID="chkLoadLayout" CssClass="table-data-pnlpopup" runat="server"
            DataValueField="ID" DataTextField="Layout" RepeatColumns="3" RepeatDirection="Horizontal"
            Font-Size="8px">
        </asp:CheckBoxList>
        <br />
        <asp:Button ID="btnRunLayout" runat="server" Text="Run" CssClass="button" OnClick="btnRunLayout_Click" />
        <asp:Button ID="btnEditLayout" runat="server" Text="Edit" CssClass="button" OnClick="btnEditLayout_Click" />
        <asp:Button ID="btndeletLayout" runat="server" Text="Delete" CssClass="button" OnClick="btndeletLayout_Click" />
    </asp:Panel>
    <asp:HiddenField ID="HiddenField1" runat="server" />
    <asp:ModalPopupExtender ID="ModalPopupExtender2" runat="server" TargetControlID="HiddenField1"
        PopupControlID="Panel1" BackgroundCssClass="modalBackground" CancelControlID="SaveLayoutClose">
    </asp:ModalPopupExtender>
    <asp:Panel ID="Panel1" CssClass="pnlpopup" runat="server" BackColor="White" Height="269px"
        Width="400px" Style="display: none">
        <div class="closebtn">
            <a id="SaveLayoutClose" runat="server">X</a></div>
        <asp:Label CssClass="labelleft" ID="lblLayoutName" runat="server" AssociatedControlID="txtLayoutName1"
            Text="Layout Name"></asp:Label>
        <asp:TextBox ID="txtLayoutName1" runat="server" ValidationGroup="layout" MaxLength="50"></asp:TextBox>
        <asp:RequiredFieldValidator runat="server" CssClass="validationtxt" ID="reqName"
            ValidationGroup="layout" ControlToValidate="txtLayoutName1" ErrorMessage="Please enter layout name!" />
        <asp:Button ID="btnLayout" runat="server" ValidationGroup="layout" CssClass="button"
            Text="Save" OnClick="btnLayout_Click" />
    </asp:Panel>
   <asp:HiddenField ID="HiddenField2" runat="server" />
    <asp:ModalPopupExtender ID="ModalPopupExtender3" runat="server" TargetControlID="HiddenField2"
        PopupControlID="Panel2" BackgroundCssClass="modalBackground" CancelControlID="A1">
    </asp:ModalPopupExtender>
    <asp:Panel ID="Panel2" CssClass="pnlpopup" runat="server" BackColor="White" Width="600px"
        Style="display: none;">
        <div class="closebtn">
            <a id="A1" runat="server">X</a></div>
        <div style="overflow-y: scroll; overflow-x: hidden; width: 100%; height: 380px">
            <asp:Label ID="lblNoteCategory1" runat="server" Text="No record found" Visible="false" ForeColor="Red" Font-Size="Larger"></asp:Label>
            <asp:CheckBoxList runat="server" ID="chkCategory" DataTextField="CategoryName" width="100%" DataValueField="CategoryID"
                ValidationGroup="Category">
            </asp:CheckBoxList>
       
        </div>
        <asp:Button ID="btnSaveCategory" runat="server" CssClass="button" Text="Save" OnClick="btnSaveCategory_Click"
            ValidationGroup="Category" />&nbsp;&nbsp;<asp:Button ID="btnCancelCategory" runat="server"
                CssClass="button" Text="Cancel" OnClick="btnCancelCategory_Click" />
          <asp:CustomValidator ID="CustomValidator2" ErrorMessage="Please select at least one item."
        ForeColor="Red" ClientValidationFunction="ValidateCheckBoxListCategory"  ValidationGroup="Category" runat="server" />
         <script type="text/javascript">
             function ValidateCheckBoxListCategory(sender, args) {
                 var checkBoxList = document.getElementById("<%=chkCategory.ClientID %>");
                 var checkboxes = checkBoxList.getElementsByTagName("input");
                 var isValid = false;
                 for (var i = 0; i < checkboxes.length; i++) {
                     if (checkboxes[i].checked) {
                         isValid = true;
                         break;
                     }
                 }
                 args.IsValid = isValid;
             }
    </script>
    </asp:Panel>
  
    <asp:HiddenField ID="HiddenField3" runat="server" />
    <asp:ModalPopupExtender ID="ModalPopupExtender4" runat="server" TargetControlID="HiddenField3"
        PopupControlID="Panel3" BackgroundCssClass="modalBackground" CancelControlID="A2">
    </asp:ModalPopupExtender>
    <asp:Panel ID="Panel3" CssClass="pnlpopup" runat="server" BackColor="White" Width="600px"
        Style="display: none;">
        <div class="closebtn">
            <a id="A2" runat="server">X</a></div>
        
                <div style="overflow-y: scroll; overflow-x: hidden; width: 100%; height: 380px">
                 
                <asp:UpdatePanel ID="udpInnerUpdatePanel" runat="Server" UpdateMode="Conditional">
            <ContentTemplate>
             <asp:Label ID="lblNoteProduct" runat="server" Text="No record found" Visible="false" ForeColor="Red" Font-Size="Larger"></asp:Label>
                    <asp:CheckBoxList runat="server" ID="chkProduct" DataTextField="ProductName" Width="100%" DataValueField="ProductID"
                        ValidationGroup="Product">
                    </asp:CheckBoxList>
                    </ContentTemplate>
                    
        </asp:UpdatePanel>
                    <script>
                        function ValidateModuleList(source, args) {
                           
                            var chkListModules = document.getElementById('<%= chkProduct.ClientID %>');
                            var chkListinputs = chkListModules.getElementsByTagName("input");
                            for (var i = 0; i < chkListinputs.length; i++) {
                                if (chkListinputs[i].checked) {
                                    args.IsValid = true;
                                    return;
                                }
                            }
                            args.IsValid = false;
                        }
                    </script>
                </div>
                <asp:Button ID="btnSaveProduct" runat="server" CssClass="button" Text="Save" OnClick="btnSaveProduct_Click"
                    ValidationGroup="Product" />&nbsp;&nbsp;<asp:Button ID="btnCancelProduct" runat="server"
                        CssClass="button" Text="Cancel" OnClick="btnCancelProduct_Click" />
                <asp:CustomValidator runat="server" ID="CustomValidator1" ClientValidationFunction="ValidateModuleList"
                    ErrorMessage="Please Select Atleast one Product" ValidationGroup="Product"></asp:CustomValidator>
            
    </asp:Panel>
    
    </ContentTemplate>
    <Triggers>
    <asp:AsyncPostBackTrigger ControlID="lnkCategory" />
    </Triggers>
        </asp:UpdatePanel>
         </asp:Panel>
    <script>
        $(document).ready(function () {
            $(".table-data-pnlpopup input[type=checkbox]").click(function (eventData) {
                var checked = $(eventData.currentTarget).prop("checked");
                if (checked) {
                    $(".table-data-pnlpopup input[type=checkbox]").prop("checked", false); //uncheck everything.
                    $(eventData.currentTarget).prop("checked", "checked"); //recheck this one. 
                }
            });
        });

    </script>
    <script type="text/javascript">


        function ShowProgress() {
            document.getElementById('<% Response.Write(updateProgress.ClientID); %>').style.display = "inline";
        }
    

    </script>
    <asp:UpdateProgress id="updateProgress" runat="server">
     <ProgressTemplate>
            <div style="position: fixed; text-align: center; height: 100%; width: 100%; top: 0; right: 0; left: 0; z-index: 9999999; background-color: #000000; opacity: 0.7;">
                    <asp:Image ID="imgUpdateProgress" runat="server" ImageUrl="~/assets/loader.gif" AlternateText="Loading ..." ToolTip="Loading ..." style="padding: 10px;position:fixed;top:45%;left:50%;" />
            </div>
     </ProgressTemplate>
</asp:UpdateProgress>
</asp:Content>
